<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <input id="userName" type="text" value="Luoyuecheng" />
  <button id="button" onclick="handleClick(event)">发送</button>
</body>
<script>
  const ws = new WebSocket('ws://localhost:3110', 'ginrummy');

  // Connection opened
  ws.addEventListener('open', function (event) {
    console.log('ws open');
    ws.send(JSON.stringify({ data: 'Hello Server!' }));
  });

  // Listen for messages
  ws.addEventListener('message', function (event) {
      console.log('Message from server ', event.data);
  });

  let code = 1;
  function handleClick(event) {
    console.log(code);
    ws.send(JSON.stringify({ data: '发送数据： ' + code++ }));
    ws.send(JSON.stringify({
      action: 'connect',
      data: {
        userName: document.getElementById('userName').value,
        password: btoa(document.getElementById('userName').value)
      }
    }));
  }
</script>
</html>